<template>
  <div id="JobChance">
    <div class="banner container-fuild text-center">二手设备与升级改造</div>
    <div class="container">
      <van-empty v-if="lei_arr.length == 0" description="暂无数据" />
      <el-divider></el-divider>
      <!-- <div style="height"></div>
      <div v-for="(i, k) in order" :key="k">
        <van-card
          v-if="order.length"
          class="cus"
          :title="'名称: '+ i.dname"
         
          @click="go_xun"
        >
         <template #tags>
    <van-tag plain type="danger" class="mt">规格: {{i.guge}}</van-tag>
    <div class="mt">品牌:{{i.depai?i.depai:'暂无'}}</div>
    <div class="mt">状态:{{i.state==1?'正常':'其他'}}</div>
    <div class="mt">备注:{{i.marks?'正常':'其他'}}</div>
    <div class="mt">购买时间:{{i.buydate}}</div>
     <div class="mt" v-if="i.linkurl">
                  证书:
                  <div
                    v-for="(n, m) in i.linkurl.split(',')"
                    :key="m"
                    @click.stop="open_zs(n)"
                  >
                    {{ $base + n }}
                  </div>
                </div>
  </template>
  <template #num>
      <div>编号: {{i.dnum}}</div>
  </template>
        </van-card>
   
      </div> -->

       <van-button
            type="info"
            v-for="i in lei_arr"
            class="mt"
            style="width: 45vw"
            :key="i.id"
            @click="go_cp(i)"
           
          >
            {{ i.gname }}
          </van-button>
      <el-divider></el-divider>
    </div>
  </div>
</template>
<script>
import { WOW } from "wowjs";
import { Empty, Card } from "vant";
export default {
  name: "Device",
  data() {
    return {
      lei_arr:[],
      user: "",
      order: [],
      time:[]
    };
  },
  mounted() {
    let lg = localStorage.getItem("lg");

    if (!lg) {
      this.$router.replace("/login");
    }
    var wow = new WOW();
    wow.init();
    let user = JSON.parse(localStorage.getItem("user"));
    this.user = user;
    // this.get_order();
   
    
    this.get_lei()


  },
  methods: {
     go_cp(i) {
      this.$router.push({ path: "/xiang", query: { i: encodeURIComponent(JSON.stringify(i)) } });
    },
    get_lei() {
      let data = {
        type: 4,
      };
      let v = this;
      this.http.post("/products/getproductlei", data).then((res) => {
        console.log("分类4:", res);
        if (res.data.data) {
          v.lei_arr = res.data.data;
          // v.get_lei2(v.lei_arr[0].id)
        } else {
          // v.lei_arr=[]
        }
      });
    },
     open_zs(e) {
      console.log("e:", e);
      window.open(this.$base + e);
    },
      go_xun(){
          this.$router.push('/contactus')
      },
    timeTrans(date){
    var date = new Date(date*1000);
    var Y = date.getFullYear() + '-';
    var M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
    var D = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate()) + ' ';
    var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
    var m = (date.getMinutes() <10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
    var s = (date.getSeconds() <10 ? '0' + date.getSeconds() : date.getSeconds());
    return Y+M+D+h+m+s;
},
//  console.log('time',timeTrans(1615801375)) 

    get_order() {
      let v = this;
      let id = this.user[0].id;
    //   let data = {
    //     uid: id,
    //   };
      this.http.post("/products/getdeviceinfo").then((res) => {
        console.log("设备:", res);
        let dd=res.data.data;
    //     for(let i of dd){
    //      let tt=  v.timeTrans(i.createtime);
    //        v.time.push(tt)
    //    }

        if (res.data.data) {
          v.order = res.data.data;
        }
      });
    },
  },
};
</script>
<style scoped>
.banner {
  color: #fff;
  font-size: 30px;
  height: 150px;
  line-height: 150px;
  background-image: url("../assets/img/banner_2.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: scroll;
  background-position: center center;
}
.JobChance-container {
  margin: 100px;
  padding: 30px;
  transition: all ease 0.5s;
  border: 1px dashed salmon;
}
.JobChance-container h2 {
  color: rgb(255, 102, 19);
  font-weight: bolder;
  text-align: center;
}
.JobChance-container p {
  font-size: 20px;
  color: rgb(255, 102, 19);
  font-weight: 700;
}
.JobChance-container ol {
  list-style-type: decimal;
  padding-left: 30px;
}
.JobChance-container ol > li {
  font-size: 14px;
  line-height: 2.7rem;
}
@media screen and (max-width: 997px) {
  .JobChance-container {
    margin: 20px 0;
    padding: 20px;
    border: 1px dashed salmon;
  }
}
</style>

